import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primaryColor: Colors.red),
      home: Scaffold(
        appBar: AppBar(title: const Text('Flutter app')),
        body: MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final List<Widget> tempList;
  MyHomePage({super.key})
    : tempList = List.generate(
        11,
        (i) => Container(
          alignment: Alignment.center,
          decoration: const BoxDecoration(color: Colors.blue),
          child: Text("第$i个元素", style: const TextStyle(fontSize: 20)),
        ),
      );

  @override
  Widget build(BuildContext context) {
    return GridView.count(
      crossAxisCount: 2, // 横轴元素个数
      crossAxisSpacing: 10, // 横轴间距
      mainAxisSpacing: 10, // 纵轴间距
      childAspectRatio: .8, // 宽高比
      padding: EdgeInsets.all(10), // 内边距
      children: tempList,
    );
  }
}

List listData = [
  {
    "title": 'Candy Shop',
    "author": 'Mohamed Chahin',
    "imageUrl":
        "https://tse3-mm.cn.bing.net/th/id/OIP-C.FYx55PIoNajL-lEV5UhFlAHaNK?rs=1&pid=ImgDetMain",
  },
  {
    "title": 'Candy Shop2',
    "author": 'Mohamed Chahin',
    "imageUrl":
        "https://tse3-mm.cn.bing.net/th/id/OIP-C.FYx55PIoNajL-lEV5UhFlAHaNK?rs=1&pid=ImgDetMain",
  },
  {
    "title": 'Candy Shop3',
    "author": 'Mohamed Chahin',
    "imageUrl":
        "https://tse3-mm.cn.bing.net/th/id/OIP-C.FYx55PIoNajL-lEV5UhFlAHaNK?rs=1&pid=ImgDetMain",
  },
  {
    "title": 'Candy Shop4',
    "author": 'Mohamed Chahin',
    "imageUrl":
        "https://tse3-mm.cn.bing.net/th/id/OIP-C.FYx55PIoNajL-lEV5UhFlAHaNK?rs=1&pid=ImgDetMain",
  },
];
